<template>
    <div>
        <div class="startBg">
            <div class="card">
                <div class="name">李四</div>
                <div class="score">
                    20.5<span>分</span>
                    <div class="star1">
                        <!-- <img src="../images/end/star_01.jpg" alt=""> -->
                    </div>
                    <div class="star2">
                        <!-- <img src="../images/end/star_02.jpg" alt=""> -->
                    </div>
                </div>
                <div class="thanks">考试已结束，感谢作答！</div>
                <div class="time">
                    <div class="true">
                        <p class="p1">20%</p>
                        <p class="p2">正确率</p>
                    </div>

                    <div class="true">
                        <p class="p1">00:45:34</p>
                        <p class="p2">答题用时</p>
                    </div>
                </div>
                <el-button class="btn" @click="goAnalysisView">查看解析</el-button>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            _id: "",
            title: "",
            durations: "",
            end: "",
            start: "",
            userInfo:{}
        }
    },
    methods: {
        goAnalysisView() {
            // this._id = this.$route.query._id;
            this.$router.push({
                path: "/analysis",
                // query: {
                //     _id: this._id
                // }
            });

        }
    },
    async created() {
        // console.log(this.$route.query);
        this._id = this.$route.query._id;
        // const res = await this.$api.test.getTestsByIdApi({ _id: this._id });
        this.userInfo = JSON.parse(localStorage.getItem("userInfo"));
        // if (res.code) {
        //     //获取成功
        //     this.title = res.data.title;
        //     this.durations = res.data.durations;
        //     // this.title = res.data.end-time;
        //     // this.title = res.data.start-time;

        // }
        console.log("试卷基本信息", res);
        console.log("unsr", this.userInfo);
        // console.log("试卷基本信息", res.data.end-time);
        

    },
}
</script>

<style lang="scss" scoped>
.startBg {
    width: 100%;
    height: 608px;
    background-image: url(../../assets/images/Tests/start-exam.png);
    position: relative;

    .card {
        width: 400px;
        height: 330px;
        background-color: #ffffff;
        position: absolute;
        top: 120px;
        left: 460px;
        .name{
            height: 20px;
            text-align: center;
            font-family: SourceHanSansCN-Bold;
            font-size: 28px;
            font-weight: normal;
            font-stretch: normal;
            line-height: 45px;
            letter-spacing: 0px;
            color: #333333;
            margin-top: 30px;
        }
        .score{
            height: 40px;
            width: 100%;
            text-align: center;
            font-family: SourceHanSansCN-Bold;
            font-size: 28px;
            line-height: 45px;
            letter-spacing: 0px;
            color: #6966eb;
            text-align: center;
            display: inline-block;
            margin-top: 30px;
            span{
                font-size: 13px;
                color: #6966eb;
            }
            .star1{
                width: 16px;
                height: 16px;
                position: relative;
                top: -40px;
                left: 120px;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
            .star2{
                width: 15px;
                height: 15px;
                position: relative;
                top: -80px;
                left: 219px;
                img{

                }
            }
        }
        .thanks{
            text-align: center;
            font-size: 12px;
            letter-spacing: 0px;
            color: #333333;
        }
        .time{
            width: 260px;
            height: 50px;
            margin: auto;
            display: flex;
            margin-top: 20px;
            .true {
                width: 50%;
                height: 60px;
                margin-top: 10px;
                background-color: #ffffff;
                border: solid 1px #ebebeb;
                .p1 {
                    height: 50%;
                    font-family: SourceHanSansCN-Regular;
                    font-size: 13px;
                    font-weight: bold;
                    color: #6966eb;
                    text-align: center;
                    margin: 0px;
                    padding-top: 10px;
                }
                .p2 {
                    text-align: center;
                    font-size: 13px;
                    color: #333333;
                    margin: 0px;
                  }
            }
        }
        .btn{
            width: 100px;
            height: 40px;
            background-color: #726fff;
            border-radius: 4px;
            border: 0px;
            margin-top: 40px;
            color: white;
            margin-left: 150px;
        }
    }

}
</style>